<%@ page contentType="text/html;charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />

<html>
	<head>
		<title>用户管理</title>

		<script>
	$(document).ready(function() {
	var boxes = $("input[name='userType']",$("#userTypes"));
    boxes.on("ifChanged", function(event){
		changeUserType($(this).val());
	});
	//icheck 插件不支持
	  /* $("input[name='userType']").change(function(){
		  var value=$(this).val();
		  changeUserType(value);
	  }); */
	  
	
		//聚焦第一个输入框
		$("#username").focus();
		//为inputForm注册validate函数
		$("#inputForm").validate({
			rules : {
				username : {
					remote : "${ctx}/register/checkUsername?action=${action}"
				}
			},
			messages : {
				username : {
					remote : "用户名已存在"
				}
			}
		});
	});
	
	
	
	function changeUserType(item){
	
	  if("customer"==item){
	     $("#paiuType").hide();
	     $("#customerType").show();
	  }else if("paiu"==item){
	     $("#paiuType").show();
	     $("#customerType").hide(); 
	  }
	}
	
	function ajaxUserAreaGroup(item) {
		customerCode=item.value;
		$.ajax({
					type : 'post',
					url : '${ctx}/areaGroup/ajaxUserAreaGroup',
					data : 'customerCode=' + customerCode,
					dataType : 'json',
					success : function(data) {
					  var tempString="";
						if (data.status == "1") {
							$.each(data.content,function(i){
							    tempString+="<option value="+data.content[i].groupCode+">"+data.content[i].groupName;
							});
						} else {
							alert(data.content);
						}
                        $("#areagroupListsTwo").html(tempString);
                        $("#areagroupListsTwo").trigger("chosen:updated");
					},
					error : function() {
						alert("获取信息错误！");
					}
				});
	}

	
	
	function init(){
		
		  if("update"=='${action}'){
			  changeUserType('${user.userType}');
		  }else{
			  $("#paiuType").hide();
			  $("#customerType").show();
		  }
	}	
	
</script>

				

				
	</head>

	<body>
	<section class="content">
<div class="row">
		<div class="col-md-12">

			<!-- Primary box -->
			<div class="box box-solid box-primary">
				<div class="box-header">
					<i class="fa fa-edit"></i>
					<h3 class="box-title">用户管理</h3>
					<div class="box-tools pull-right">
						<button class="btn btn-primary btn-sm" data-widget="collapse">
							<i class="fa fa-minus"></i>
						</button>
					</div>
				</div>
				<div class="box-body">
		<form id="inputForm" action="${ctx}/v2/admin/user/${action}"
			method="post" class="form-horizontal">
			<input type="hidden" name="id" value="${user.id}" />
			<fieldset>
				<div class="form-group">
					<label for="username" class="col-sm-3 control-label">
						用户名:
					</label>
					<div class="col-sm-6">
						<input type="text" id="username" name="username"
							value="${user.username}" class="form-control input-large required"
							minlength="3" />
					</div>
				</div>
				<div class="form-group">
					<label for="realname" class="col-sm-3 control-label">
						真实姓名:
					</label>
					<div class="col-sm-6">
						<input type="text" id="realname" name="realname"
							value="${user.realname}" class="form-control input-large required" />
					</div>
				</div>
				<div class="form-group">
					<label for="plainPassword" class="col-sm-3 control-label">
						密码:
					</label>
					<div class="col-sm-6">
						<input type="password" id="plainPassword" name="plainPassword"
							onchange="if(!/(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,24}/.test(this.value)){alert('密码必须包含 大写字母、小写字母、数字，密码长度 6位以上');this.value='';}" placeholder="必须包含 大写字母、小写字母、数字，密码长度 6位以上"
							value="" class="form-control input-large required" />
					</div>
				</div>
				<div class="form-group">
					<label for="confirmPassword" class="col-sm-3 control-label">
						确认密码:
					</label>
					<div class="col-sm-6">
						<input type="password" id="confirmPassword" name="confirmPassword"
							value="" class="form-control input-large" equalTo="#plainPassword" />
					</div>
				</div>
				<div class="form-group">
					<label for="mail" class="col-sm-3 control-label">
						邮箱:
					</label>
					<div class="col-sm-6">
						<input type="text" id="mail" name="mail"
							value="${user.mail}" class="form-control"/>
					</div>
				</div>
				<c:choose>
				  <c:when test="${user.userType eq null }">
				  <div class="form-group">
					<label for="userType" class="col-sm-3 control-label">
						账户类型:
					</label>
					<div class="col-sm-6" id="userTypes">
						 <input id="customerradio" type="radio" name="userType" value="customer" <c:if test="${user.userType eq 'customer' }"> checked </c:if> />商家用户
						 <input id="paiuradio" type="radio" name="userType" value="paiu" <c:if test="${user.userType eq 'paiu' }"> checked </c:if>/>能容用户
					</div>
				</div>
				      <div id="customerType">
				   <div class="form-group">
					<label for="customerCode" class="col-sm-3 control-label">
						客户:
					</label>
					<div class="col-sm-6">
						<select class="form-control" id="customerCode" name="customerCode" onchange="ajaxUserAreaGroup(this);">
							<c:forEach items="${customers}" var="obj">
								<option value="${obj.customerCode }"
									<c:if test="${user.customerCode eq obj.customerCode}">selected="selected"</c:if>> ${obj.customerName } </option>
							</c:forEach>
						</select>
					</div>
				  </div>
				  <div class="form-group">
					<label for="areagroupLists" class="col-sm-3 control-label">
						仓库组合:
					</label>
					<div class="col-sm-6">
						<select class="form-control" id="areagroupListsTwo" name="areagroups"  multiple="multiple">
							<c:forEach items="${customerAreaGroup}" var="obj">
								<option value="${obj.groupCode }">${obj.groupName }
								</option>
							</c:forEach>
						</select>
					</div>
				</div>
			   </div>
				
			 <div id="paiuType">
			    <div class="form-group">
					<label for="areagroupLists" class="col-sm-3 control-label">
						网点组合:
					</label>
					<div class="col-sm-6">
						<select class="form-control" id=areagroupLists name="areagroups"  multiple="multiple">
							<c:forEach items="${areaGroups}" var="obj">
								<c:if test="${obj.warehouseType eq 'paiu'}">
								<option value="${obj.groupCode }">${obj.groupName }
								</option>
								</c:if>
							</c:forEach>
						</select>
					</div>
				</div>
				<div class="form-group">
					<label for="customerLists" class="col-sm-3 control-label">
						客户组:
					</label>
					<div class="col-sm-6">
						<select class="form-control required" id="customerLists" name="customers"  multiple="multiple">
							<c:forEach items="${customers}" var="obj">
								<option value="${obj.customerCode }">${obj.customerName }</option>
							</c:forEach>
						</select>
					</div>
				</div>
			</div>
			<script>
			  init();
			 </script>
				  </c:when>
				  
				  <c:otherwise>
				  
				   
				  <c:if test="${user.userType eq 'customer'}">
				    <div id="customerType">
				   <div class="form-group">
					<label for="customerCode" class="col-sm-3 control-label">
						客户:
					</label>
					<div class="col-sm-6">
						<select class="form-control" id="customerCode" name="customerCode" onchange="ajaxUserAreaGroup(this);">
							<c:forEach items="${customers}" var="obj">
								<option value="${obj.customerCode }"
									<c:if test="${user.customerCode eq obj.customerCode}">selected="selected"</c:if>> ${obj.customerName } </option>
							</c:forEach>
						</select>
					</div>
				  </div>
				  <div class="form-group">
					<label for="areagroupLists" class="col-sm-3 control-label">
						仓库组合:
					</label>
					<div class="col-sm-6">
						<select class="form-control" id="areagroupListsTwo" name="areagroups"  multiple="multiple">
							<c:forEach items="${customerAreaGroup}" var="obj">
								<option value="${obj.groupCode }" <c:forEach items="${user.areagroupLists}" var="o"><c:if test="${o eq obj.groupCode }">selected="selected"</c:if></c:forEach>>
									${obj.groupName }
								</option>
							</c:forEach>
						</select>
					</div>
				</div>
			   </div>
				  </c:if>
				     
				<c:if test="${user.userType eq 'paiu'}">
				
				<div id="paiuType" >
			    <div class="form-group">
					<label for="areagroupLists" class="col-sm-3 control-label">
						网点组合:
					</label>
					<div class="col-sm-6">
						<select class="form-control" id=areagroupLists name="areagroups"  multiple="multiple">
							<c:forEach items="${areaGroups}" var="obj">
							<c:if test="${obj.warehouseType eq 'paiu'}">
								<option value="${obj.groupCode }" <c:forEach items="${user.areagroupLists}" var="o"><c:if test="${o eq obj.groupCode }">selected="selected"</c:if></c:forEach>>
									${obj.groupName }
								</option>
								</c:if>
							</c:forEach>
						</select>
					</div>
				</div>
				<div class="form-group">
					<label for="customerLists" class="col-sm-3 control-label">
						客户组:
					</label>
					<div class="col-sm-6">
						<select class="form-control required" id="customerLists" name="customers"  multiple="multiple">
							<c:forEach items="${customers}" var="obj">
								<option value="${obj.customerCode }" <c:forEach items="${user.customerLists}" var="o"><c:if test="${o eq obj.customerCode }">selected="selected"</c:if></c:forEach>>
									${obj.customerName }
								</option>
							</c:forEach>
						</select>
					</div>
				</div>
			</div>
               </c:if>
			 
				  </c:otherwise>
				</c:choose>

				<div class="form-group">
					<label for="roles" class="col-sm-3 control-label">
						角色:
					</label>
					<div class="col-sm-6">
						<select class="form-control" id="roles" name="roles" multiple="multiple">
							<c:forEach items="${roles}" var="role">
								<option value="${role.id}"
									<c:forEach items="${user.roleList}" var="userRole"><c:if test="${role.id eq userRole.id }">selected="selected"</c:if></c:forEach>>
									${role.rolename}
								</option>
							</c:forEach>
						</select>
					</div>
				</div>
				
				<div class="form-group">
					<label for="status" class="col-sm-3 control-label">
						状态:
					</label>
					<div class="col-sm-6">
						<select class="form-control" id="status" name="status">
							<option value="1"
								<c:if test="${user.status eq '1'}">selected="selected"</c:if>>
								有效
							</option>
							<option value="0"
								<c:if test="${user.status eq '0'}">selected="selected"</c:if>>
								无效
							</option>
						</select>
					</div>
				</div>
				<div class="modal-footer bg-gray">
					<input id="submit_btn" class="btn btn-primary" type="submit"
						value="提交" />
					&nbsp;
					<input id="cancel_btn" class="btn" type="button" value="返回"
						onclick="history.back()" />
				</div>
			</fieldset>
		</form>
		</div>
		</div>
		</div>
		</div>
		</section>
	</body>
</html>
